<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>分类管理</title>
		<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" rel="stylesheet">
		<link href="https://cdnjs.cloudflare.com/ajax/libs/layer/2.3/skin/layer.css" rel="stylesheet">
		<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
		<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.15.4/bootstrap-table.css" rel="stylesheet">
		<link href="../static/css/index.css" rel="stylesheet" />
	</head>

	<body>
		<!--导航-->
		<div id="head"></div>
		<div class="ui attached pointing menu">
			<div class="ui container">
				<div class="right menu">
					<a href="types-input.html?type=add" class="item">新增</a>
					<a href="types.html" class="teal active item">列表</a>
				</div>
			</div>
		</div>

		<!--中间内容-->
		<div class="i-container-small i-padded-tb-big">
			<div class="ui container">
				<table id="typeTable"></table>
			</div>
		</div>

		<br>
		<br>
		<!--底部footer-->
		<div id="foot"></div>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js"></script>
		<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/layer/2.3/layer.js"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.15.4/bootstrap-table.js"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.15.4/locale/bootstrap-table-zh-CN.min.js"></script>
		<!-- axios -->
		<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
		<script src="../static/js/function.js"></script>
		<script>
			$(function() {
				$('#head').load('../common/head-admin.html',null,function(){
				$('.navbarlist a').removeClass('active');
				$('.navbarlist a:eq(1)').addClass('active');
			});
			$('#foot').load('../common/foot.html');
				typeTable();
			})
			$('.menu.toggle').click(function() {
				$('.i-item').toggleClass('i-mobile-hide');
			});

			$('.ui.dropdown').dropdown({
				on: 'hover'
			});

			//消息提示关闭初始化
			$('.message .close')
				.on('click', function() {
					$(this)
						.closest('.message')
						.transition('fade');
				});

			function typeTable() {
				$("#typeTable").bootstrapTable({
					url: urlPath + "/type/api/types",
					method: 'get',
					contentType: 'application/json',
					sidePagination: 'server',
					cache: false,
//					sortOrder: 'desc',
					pageNumber: 1,
					paginationPreText: "上一页",
					paginationNextText: "下一页",
						rowStyle: function() {
						return {
							css: {
								"text-align": " center"
							}
						}

					},
					queryParams: function(params) {
						params.pageSize = this.pageSize;
						params.page = this.pageNumber;
						params.sort = params.sort;
						params.order = params.order;
						return params;
					},
					onLoadSuccess: function(data) {},
					onLoadError: function(status) {},
					onPageChange: function(number, size) {},
					striped: true,
					pagination: true,
					pageSize: 10,
					pageList: [10, 20, 50],
					minimumCountColumns: 2,
					columns: [{
							title: "序号",
							align: "center",
							formatter: function(value, row, index) {
								return index + 1;
							}
						},
						{
							title: "名称",
							align: "center",
							field: "name",
							width: 500,
						},
						{
							title: "操作",
							align: "center",
							formatter: function(value, row, index) {
								var html = '<a href="types-input.html?type=edit&id='+row.id+'" class="ui mini teal basic button">编辑</a>' +
									'<a href="javascript:void(0);" onclick="delete_type('+row.id+')" class="ui mini red basic button">删除</a>';
								return html;
							}
						}
					],
				});
			}
			
			function delete_type(id){
				$.ajax({
					type:"get",
					url:urlPath + "/type/api/delete_type",
					data:{'id':id},
					success:function(res){
						propSuccess(res,function(){
							window.location.reload();
						})
					}
				});
			}
		</script>
	</body>

</html>